<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <style>
    	body{
    		
    	}
    </style>
</head>
<body>
	 <!-- 图表容器 DOM -->
    <div id="container" style="height:300px;"></div>
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/highcharts.js"></script>
<script type="text/javascript">
	apiready = function(){
		$api.css($api.byId("container"), 'width:100%');
		  // 图表配置
        var options = {
			chart: {
				type: 'spline'
			},
			title: {
				text: '两地月平均温度'
			},
			subtitle: {
				text: '数据来源: WorldClimate.com'
			},
			xAxis: {
				categories: ['一月', '二月', '三月', '四月', '五月', '六月',
							 '七月', '八月', '九月', '十月', '十一月', '十二月']
			},
			yAxis: {
				title: {
					text: '温度'
				},
				labels: {
					formatter: function () {
						return this.value + '°';
					}
				}
			},
			tooltip: {
				crosshairs: true,
				shared: true
			},
			plotOptions: {
				spline: {
					marker: {
						radius: 4,
						lineColor: '#666666',
						lineWidth: 1
					}
				}
			},
			series: [{
				name: '东京',
				marker: {
					symbol: 'triangle'//曲线点类型：”circle”, “square”, “diamond”, “triangle”,”triangle-down”，默认是”circle” 
				},
				data: [7.0, -6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
					y: 26.5,
					marker: {
						//symbol: 'url(https://code.highcharts.com.cn/highcharts/graphics/sun.png)'
					}
				}, 23.3, 18.3, 13.9, 9.6]
			}, {
				name: '伦敦',
				marker: {
					symbol: 'diamond'
				},
				data: [{
					y: 3.9,
					marker: {
						//symbol: 'url(https://code.highcharts.com.cn/highcharts/graphics/snow.png)'
					}
				}, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, -14.2, 10.3, 6.6, 4.8]
			},
			{
				name: '广州',
				marker: {
					//symbol: 'diamond'
				},
				data: [{
					y: 13.9,
					marker: {
						//symbol: 'url(https://code.highcharts.com.cn/highcharts/graphics/snow.png)'
					}
				}, 41.2, -5.7, 18.5, 1.9, 0.2, -17.0, 16, -14.2, 20.3, 2.6, 10.8]
			}]
		};
        // 图表初始化函数
        var chart = Highcharts.chart('container', options);
	};
</script>
</html>